iT邦幫忙

第 11 屆 iThome 鐵人賽

DAY 20
0
自我挑戰組

非本科之30天Ruby / Rails學習筆記系列 第 20

Day20: 簡易Rails實作(上)

  • 分享至 

  • xImage
  •  

在開始之前,要先知道用Rails的慣例,並且盡量遵守才不會造成後面要接手的人的困擾。尤其是以下說明需特別注意:

在檔案區命名:snakecase ex: candidate_controller
在檔案內命名:camelcase ex: CandidateController
且“檔案名稱”與“類別名稱”必須相同,才不會在執行的時候出現error

什麼是MVC(Model、View、Controller)?

在開始建立Rails之前,我們需要先了解什麼是MVC

MVC架構:由Route開始,到Controller結束。

  1. 瀏覽器依據資源(resources)的設定,經由Route去找到Controller中,對應的action(method)。
  2. 視需要透過Model向資料庫取得資料後,處理完再與對應的View(.html.erb)做結合。
  3. View處理完後再回傳給Controller,Controller再將結果轉交給瀏覽器。

建立Rails專案

在Terminal輸入,就會自動產生rails專案。(前提是要先安裝好Rails)

rails new 專案名稱

在這次的例子,我們試著產生一個名叫myvote的Rails檔案。

routes.rb

在Vscode開啟資料夾,用command+P尋找檔案“routes.rb”,並寫入:

  1. Rails 提供的 resources
  2. 根目錄(首頁) candidates,且裡面有個方法index

第2行:產生8種條路徑

第3行:根目錄裡有個方法index

備註:

  root 'candidates#index'
  get '/', to 'candidates#index'
  #因為是根目錄,以上兩種寫法都可以接受。

在此時在Terminal執行Rails:

rails server 或 rails s

至網址輸入localhost:3000(Terminal會寫3000)出現以下畫面:

找不到method,故要建立一個給它。

建立Method

在app > controllers中新增檔案 “檔名_controller.rb” (此例檔名為candidates,需與你要連結的檔案名稱一樣),並建立class 、繼承最原始的檔案“ApplicationController”:(其實此例的def index暫時不寫也沒關係)

但這樣還不夠,因為Rails的遊戲規則是要從views裡面找檔案,所以必須還要再 views 資料夾新增一個candidates資料夾,並建立 index.html.erb:

才能印出:

基本上這樣就完成最最最基礎的第一步了(此例index裡沒寫東西只是因為要當範例而已,請原諒我沒放東西(跪))

讓他稍微可以動

在index.html.erb加點東西:

Prefix :new_cadidates

還記得剛剛的rails routes嗎?其中的new功能Rails已經有幫我們定義好的Prefix名字了

_path:產生相對應的路徑網址(站內路徑)-> /candidates

*另一種方式:

_url:產生完整網址 -> https://www.xxxx.com/candidates,在寄發mail的時候較常使用)

套用Bootstrap,套用方式可見這篇

等等!!!views裡沒有new這個檔案啊!!?

所以要記得在views > candidates 裡再新增一個new.html.erb檔

這樣一來就可以有作用囉!!

總結

Rails這只是第一步而已,雖然現在有很多指令可以快速產出以上步驟做出的東西(scaffold),但畢竟在使用套件之前,能夠先了解如何手刻及其背後觀念跟原理是非常重要的。

也許文章內容寫的不正確也缺乏系統,也或許幾年後回來看自己寫的這篇文章會覺得"WTF這什麼鬼!!?"

參考資料:
為你自己學 Ruby on Rails

“The pro is the person who has all the hassles, obstacles, and disappointing frustrations that everyone else has, yet continues to persist, does the job, and makes it look easy.”

— David Cooper, Sales Trainer

本文同步發佈於: https://louiswuyj.tw/


上一篇
Day19: Rails中神奇的spring stop
下一篇
Day21: 簡易Rails實作(中)
系列文
非本科之30天Ruby / Rails學習筆記30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言